import React, { useRef, useEffect } from 'react'
import flvjs from 'flv.js'

function Jiankong() {
    const videoRef = useRef(null);
    const flvPlayer = useRef(null);
    const flvUrl = "http://localhost:8000/live/demo1.flv";
    useEffect(() => {
        if (flvjs.isSupported()) {
            flvPlayer.current = flvjs.createPlayer({
                type: "flv",
                isLive: true,
                url: flvUrl,
            });
            flvPlayer.current.attachMediaElement(videoRef.current);
            flvPlayer.current.load();
            flvPlayer.current.play();
        }
        return () => {
            if (flvPlayer.current) {
                flvPlayer.current.unload();
                flvPlayer.current.detachMediaElement();
                flvPlayer.current.destroy();
            }
        };
    }, []);
    return (

        <video src="" ref={videoRef} controls style={{ marginLeft: '4%', width: '90%', height: '90%' }}></video>

    )
}

export default Jiankong
